

<ion-content>
    <ion-button class="setBtn" (click)="closeModal()">
      <ion-icon slot="icon-only" name="close"></ion-icon>
    </ion-button>
    <div class="login_head_box">
      <img src="../../assets/image/scgzimg.png" alt="" class="headImg">
      <span>{{ tabsNum == 1 ? '密码登录':'' || tabsNum == 2 ? '注册':'' || tabsNum == 3 ? '验证码登录':''}}</span>
    </div>
  
  <!-- 密码登录 -->
  <div [ngClass]="{'active2': tabsNum==1}" class="loginTabs">
    <div class="input1">
      <input type="number" [(ngModel)]='username'  class="loginTabs-input" placeholder="请输入手机号码" maxlength="11" oninput="if(value.length>11)value=value.slice(0,11)">
    </div>
    <div class="input2">
      <input [type]="eye" class="loginTabs-input" [(ngModel)]="password" placeholder="请输入密码">
      <i class="iconfont iconyanjing icon-login" (click)="show()" *ngIf="isShow"></i>
      <i class="iconfont iconyanjing_bi icon-login1" (click)="show()" *ngIf="!isShow"></i>
    </div>
    <div class="bot_box">
      <span (click)="tabsNum = 2">立即注册</span>
      <span (click)="tabsNum = 3">验证码登录</span>
    </div>
    <button class="login-btn" (click)="login()">登录</button>
    <div style="display: flex;margin-top:1rem;align-items: center;justify-content: space-between;width:100%">
      <div style="display: flex;align-items: center;"><span [ngClass]="{ yes:flag,no:!flag }"></span><span style="line-height: 1.7rem;color: #999;font-size: 0.91rem" (click)='remember()'>记住账号</span></div>
      <span style="color: #999;font-size: 0.91rem;" (click)="goForget()">忘记密码</span>
    </div> 
  </div>
  <!-- 验证码登录 -->
  <div [ngClass]="{'active2': tabsNum==3}" class="loginTabs">
    <!-- <div class="input1">
      <input type="number" [(ngModel)]='username' placeholder="请输入手机号码" class="loginTabs-input" maxlength="11" oninput="if(value.length>11)value=value.slice(0,11)">
    </div> -->
    <ion-item lines="none" class="loginTabs-item loginTabs-item1">
      <ion-input type="number" [(ngModel)]="username" placeholder="请输入手机号码"></ion-input>
    </ion-item>
    <ion-item lines="none" class="loginTabs-item">
      <ion-input [(ngModel)]="verifyNum" placeholder="请输入验证码"></ion-input>
      <button style="color: #0088fd;background-color: #fff; font-size: 1rem;border: 1px solid transparent;outline: none;" (click)="getCodeVerify()" [disabled]="!verifyCode.disable">{{verifyCode.verifyCodeTips}}</button>
    </ion-item>
    <div class="bot_box">
      <span (click)="tabsNum = 2">立即注册</span>
      <span (click)="tabsNum = 1">密码登录</span>
    </div>
    <button class="login-btn" (click)="loginByCode()">登录</button>
    <div style="display: flex;margin-top:1rem;align-items: center;justify-content: space-between;width:100%">
      <div style="display: flex;align-items: center;"><span [ngClass]="{ yes:flag,no:!flag }"></span><span style="line-height: 1.7rem;color: #999;font-size: 0.91rem" (click)='remember()'>记住账号</span></div>
      <span style="color: #999;font-size: 0.91rem;" (click)="goForget()">忘记密码</span>
    </div> 
  </div>
  <!-- 注册 -->
  <div [ngClass]="{'active2': tabsNum==2}" class="loginTabs">
    <ion-item lines="none" class="loginTabs-item loginTabs-item1">
      <ion-label>境内/境外手机号</ion-label>
      <ion-select okText="确定" cancelText="取消" [(ngModel)]="international">
        <ion-select-option value = "1">境内</ion-select-option>
        <ion-select-option value = "2">境外</ion-select-option>
      </ion-select>
    </ion-item>
    <ion-item lines="none" class="loginTabs-item">
      <ion-label>手机号</ion-label>
      <ion-input type="number" [(ngModel)]="phoneNum"></ion-input>
    </ion-item>
    <ion-item lines="none" class="loginTabs-item" *ngIf="international == 1">
      <ion-label>验证码</ion-label>
      <ion-input [(ngModel)]="verifyNum"></ion-input>
      <button style="color: #0088fd;background-color: #fff; font-size: 1rem;border: 1px solid transparent;outline: none;" (click)="getVerify()" [disabled]="!verifyCode.disable">{{verifyCode.verifyCodeTips}}</button>
    </ion-item>
    <ion-item lines="none" class="loginTabs-item">
      <ion-label>密码</ion-label>
      <ion-input [type]="eye" [(ngModel)]="pwdNum"></ion-input>
      <i class="iconfont iconyanjing icon-login" (click)="show()" *ngIf="isShow"></i>
      <i class="iconfont iconyanjing_bi icon-login1" (click)="show()" *ngIf="!isShow"></i>
    </ion-item>
    <ion-item lines="none" class="loginTabs-item">
      <ion-label>确认密码</ion-label>
      <ion-input [type]="eye" [(ngModel)]="pwdNum1"></ion-input>
      <i class="iconfont iconyanjing icon-login" (click)="show()" *ngIf="isShow"></i>
      <i class="iconfont iconyanjing_bi icon-login1" (click)="show()" *ngIf="!isShow"></i>
    </ion-item>
    <div class="bot_box">
      <span (click)="tabsNum = 1">密码登录</span>
      <span (click)="tabsNum = 3">验证码登录</span>
    </div>
    <button class="login-btn" (click)="getRegister()">注册</button>
  </div>

</ion-content>
